<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/common.css">
    <link rel="stylesheet" href="/lib/Swiper/css/swiper.min.css">
    <link rel="stylesheet" href="/css/index.css">
    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2348144_doi7jloq8yo.css">
    <link rel="icon" href="/images/logo.ico" type="image/x-icon">
    <title>搜狗商城</title>
</head>

<body>
    <!-- header start-->
    <header></header>
    <!-- header start-->

    <!-- banner start -->
    <div class="banner">
        <div class="swiper-container">
            <div class="swiper-wrapper banner_swiperWrapper">
            </div>
            <!-- 定义模板 -->
            <script type="text/html" id="bannerTemplate">
                {{each list item}}
                <div class="swiper-slide">
                    <img src="{{item.url}}" alt="">
                </div>
                {{/each}}
            </script>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
            <!-- Add Arrows -->
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>
    </div>
    <!-- banner end -->

    <!-- content start -->
    <div class="content">

    </div>
    <script type="text/html" id="contentData">
        <div class="con1">
                <div class="main">
                    <div class="head">
                        <h2>{{list[2].title}}</h2>
                        <span>{{list[2].desc}}</span>
                    </div>
                    <div class="c1-pic">
                        <a href="#">
                            <img src="{{list[4].pic.items.img}}" alt="">
                        </a>
                        <a href="#">
                            <img src="{{list[4].banner.list[0].img}}" alt="">
                        </a>
                    </div>
                </div>
            </div>
            <div class="con2">
                <div class="main">
                    <div class="head clear">
                        <h2>{{list[6].title}}</h2>
                        <span>{{list[6].desc}}</span>
                        <a href="/html/list.html?{{cateId6}}" class="fr all">全部 ></a>
                    </div>
                    <div class="prod">
                        {{each list[8].list item}}
                        <a href="/html/details.html?{{item.id}}" class="box"  price={{item.price}}>
                            <img src="{{item.img}}" alt="">
                            <p class="fs16">{{item.title}}</p>
                            <p class="fs14">{{item.desc}}</p>
                            <p class="price fs14">￥<span>{{item.price}}</span></p>
                        </a>
                        {{/each}}
                    </div>
                    <div class="pic">
                        <img src="{{list[10].list[0].img}}" alt="">
                    </div>
                </div>
            </div>
            <div class="con3">
                <div class="main">
                    <div class="head">
                        <h2>{{list[12].title}}</h2>
                        <span>{{list[12].desc}}</span>
                    </div>
                    <div class="swp">
                        <img src="{{list[14].list[0].img}}" alt="">
                    </div>
                </div>
            </div>
            <div class="con4">
                <div class="main">
                    <div class="head clear">
                        <h2>{{list[16].title}}</h2>
                        <span>{{list[16].desc}}</span>
                        <a href="/html/list.html?{{cateId16}}" class="fr all">全部 ></a>
                    </div>
                    <div class="prod">
                        {{each list[18].list item}}
                        <a href="/html/details.html?{{item.id}}" class="box">
                            <img src="{{item.img}}" alt="">
                            <p class="fs16">{{item.title}}</p>
                            <p class="fs14">{{item.desc}}</p>
                            <p class="price fs14">￥<span>{{item.price}}</span></p>
                        </a>
                        {{/each}}
                    </div>
                    <div class="pic">
                        <img src="{{list[20].list[0].img}}" alt="">
                    </div>
                </div>
            </div>
            <div class="con5">
                <div class="main">
                    <div class="head">
                        <h2>{{list[22].title}}</h2>
                        <span>{{list[22].desc}}</span>
                    </div>
                    <div class="prod">
                        {{each list[24].list item}}
                        <a href="{{item.src}}" class="box1">
                            <div class="cover pos-r">
                                <img src="{{item.cover}}" alt="">
                                <p class="play pos-a">▶</p>
                            </div>
                            <p>{{item.title}}</p>
                            <p>{{item.desc}}</p>
                        </a>
                        {{/each}}
                    </div>
                </div>
            </div>
    </script>
    <!-- content end -->

    <!-- footer start -->
    <footer></footer>
    <!-- footer end -->

    <!-- sider start -->
    <div class="cbl"></div>
    <!-- sider end -->

    <script src="/lib/requirejs/require.min.js" data-main="/js/index"></script>
</body>

</html>